<template>
    <div class="wrapper">
        <SvgIcon icon="icon-love" :style="`font-size: 15px;color:${isFav?'orange':'#868686'}`"
                 @click.native="select_fav"
        ></SvgIcon>
    </div>
</template>
<script>
    import SvgIcon from '../svgIcon'
    import withStore from "../../vuex/withStore";
    import {addFav, deletFav} from "./service";
    import {isLogin} from "../../utils";
    import MyAlert from "../../utils/myalert";

    export default withStore({
        components: {
            SvgIcon
        },
        props: ['designId'],
        computed: {
            isFav() {
                var self = this;
                if (!this.$data.favList) {
                    return false
                }
                var index = this.$data.favList.findIndex(item => item.designId == self.$props.designId)
                if (index >= 0) {
                    return true
                } else {
                    return false
                }
            }
        },
        data() {
            return {
                favList: this.getStore('fav.favList', true)
            }
        },
        mounted() {
        },
        methods: {
            select_fav() {
                /*判断登录*/
                if (!isLogin()) {
                    MyAlert.fail("请登陆")
                    return false
                }

                var self = this
                var isFav = this.isFav;
                var designId = this.$props.designId
                var favList = this.getStore('fav.favList') || []
                var index = favList.findIndex(item => item.designId == designId)
                if (isFav) {
                    // delete
                    deletFav(favList[index].objectId)
                    favList.splice(index, 1)
                    this.$data.favList = favList
                    this.setStore('fav.favList', favList)
                } else {
                    /*add*/
                    addFav(designId).then(fav => {
                        if (favList) {
                            favList.push(fav)
                            self.$data.favList = favList
                            self.setStore('fav.favList', favList)
                        }
                    })

                }
            }
        }
    })
</script>
<style lang="less" scoped>
    .wrapper {

    }
</style>